<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

    <h:form id="formPartidasOS">
        
        <p:scrollPanel style="width:500px;height:550px" mode="native">  
            <p:panelGrid style="width:80%;margin: 0px auto;" id="panelPartida" >
                <p:row>
                    <p:column>
                        <h:outputText value="ARTICULO: " class="lblForm"/>
                    </p:column>
                    <p:column>
                        <h:outputText value="#{BKPartidaDespacho.detalleOrdenCSCurrent.nombreArticulo}" />
                    </p:column>
                </p:row>


                <p:row>
                    <p:column>
                        <h:outputText value="DETALLE DE ARTICULO: " class="lblForm"/>
                    </p:column>
                    <p:column>
                        <p:selectOneMenu id="cbxDetalles" value="#{BKPartidaDespacho.detallePartida}" style="width: 140px"> 
                            <f:selectItem itemLabel="Seleccionar" itemValue="" /> 
                            <f:selectItems value="#{BKOrdenServicio.listaDetallesPP}" var="detalle" 
                                           itemLabel="#{detalle}" itemValue="#{detalle}" />	
                        </p:selectOneMenu>
                    </p:column>
                </p:row>


                <p:row>
                    <p:column colspan="2" >
                        <p:commandButton id="btnAgregarDet" value="AGREGAR" update=":formPartidasOS:dataTablaPartidas" ajax="true" 
                                         actionListener="#{MBPartidaDespacho.agregarPartida()}" styleClass="ui-priority-primary" 
                                         style="font-size: 12px" immediate="cbxDetalles @this"/>
                    </p:column>

                </p:row>

                <p:row>
                    <p:column colspan="2">
                        <p:fieldset legend="Lista de Partidas" toggleable="true">
                            <p:dataTable id="dataTablaPartidas" var="partida" 
                                         value="#{BKPartidaDespacho.listaDetallePartidas}" editable="true"
                                         emptyMessage="No hay Partidas registradas para este Articulo" rowIndexVar="rowIndex" 
                                         paginator="true" rows="10" paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} 
                                         {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}" rowsPerPageTemplate="10,20,30"
                                         paginatorPosition="top" styleClass="datable-busqueda"> 
                                <p:ajax event="rowEdit" listener="#{MBPartidaDespacho.editarPartida}" update="dataTablaPartidas"/> 

                                <p:columnGroup type="header">  
                                    <p:row>  
                                        <p:column headerText="Num." style="width: 5%" />  
                                        <p:column headerText="Color" />  
                                        <p:column headerText="Cantidad" />  
                                        <p:column headerText="" />  
                                    </p:row>  
                                </p:columnGroup> 

                                <p:column style="width: 5%" id="columnNum" rendered="#{MBPartidaDespacho.isRenderedColumn(partida.estadoRegistro)}" > 
                                    <h:outputText value="#{rowIndex+1}" /> 

                                </p:column>

                                <p:column sortBy="#{partida.detalle}" id="columnaPartida" rendered="#{MBPartidaDespacho.isRenderedColumn(partida.estadoRegistro)}" > 
                                    <h:outputText value="#{partida.detalle}" /> 
                                </p:column>

                                <p:column sortBy="#{partida.cantidad}" id="columnaValor" rendered="#{MBPartidaDespacho.isRenderedColumn(partida.estadoRegistro)}" > 
                                    <p:cellEditor>  
                                        <f:facet name="output">  
                                            <h:outputText value="#{partida.cantidad}" /> 
                                        </f:facet>  
                                        <f:facet name="input"> 
                                            <p:inputText onkeyup="cambiarMayuscula(this)" value="#{partida.cantidad}" style="width:100%" maxlength="10" required="true"/>  
                                        </f:facet>  
                                    </p:cellEditor> 
                                </p:column>
                                <p:column rendered="#{MBPartidaDespacho.isRenderedColumn(partida.estadoRegistro)}" id="columnaAcciones">             
                                    <p:commandButton id="selectButton" oncomplete="confirmacion1.show();" ajax="true"
                                                     icon="ui-icon-trash" process="@this" >
                                        <f:setPropertyActionListener value="#{partida}" target="#{BKPartidaDespacho.partidaDespachoCurrent}"/>
                                    </p:commandButton>
                                    <p:rowEditor/>  
                                </p:column> 


                            </p:dataTable>	
                        </p:fieldset>

                    </p:column>

                </p:row>

                <p:row>
                    <p:column colspan="2" style="text-align: center">
                        <p:commandButton style="text-align: center;" value="GUARDAR"
                                         actionListener="#{MBPartidaDespacho.guardarPartidas}"
                                         oncomplete="if (args.validationFailed){ armarPartida.show()} else {armarPartida.hide()};"
                                         update=":formulario:pnlDetalle,:formulario:btnEmitir,panelPartida"/>
                        <p:commandButton type="button" value="CANCELAR" 
                                         style="text-align: center;" onclick="armarPartida.hide()"/>
                    </p:column>
                </p:row>
                
            </p:panelGrid> 
        </p:scrollPanel>
        <p:confirmDialog id="dlgEliminarPartida" message="#{message['dialog.confirmacion.mensaje']}" 
                         header="#{message['dialog.confirmacion.header']}" severity="alert" widgetVar="confirmacion1" appendToBody="true">
            <h:panelGrid style="width: auto;margin:0px auto;border:0px;padding: 0 5px;z-index: 2000 !important"  columns="2">      
                <p:commandButton id="btnConfEliPartida" actionListener="#{MBPartidaDespacho.eliminarPartida}" update=":formPartidasOS:dataTablaPartidas"
                                 value="Si" oncomplete="confirmacion1.hide();colspanear()" immediate="true" style="text-align: center" process="@this"  />
                <p:commandButton id="btnCancEliPartida" value="No" onclick="confirmacion.hide()" type="button" style="text-align: center" />
            </h:panelGrid>
        </p:confirmDialog>    
        <script>
            function colspanear()
            {
                document.getElementById("formPartidasOS:dataTablaPartidas_paginator_top").colSpan = "4";
                
            }
        </script>
    </h:form>
</html>   